<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <input type="text" placeholder="请输入第一个数" class="inp1" />
    <select class="set">
      <option>+</option>
      <option>-</option>
      <option>*</option>
      <option>/</option>
    </select>
    <input type="text" placeholder="请输入第二个数" class="inp2" />
    <button>计算</button>
    <input type="text" placeholder="结果为" class="inp3" />
  </body>
</html>
<script>
  var ipt1 = document.querySelector(".inp1");
  var ipt2 = document.querySelector(".inp2");
  var ipt3 = document.querySelector(".inp3");
  var btn = document.querySelector("button");
  var se1 = document.querySelector(".set");
  btn.onclick = function () {
    if (ipt1.value.trim() == "") return alert("请输入内容");
    if (ipt2.value.trim() == "") return alert("请输入内容");
    if (isNaN(ipt1.value)) return alert("请输入数字");
    if (isNaN(ipt2.value)) return alert("请输入数字");
    switch (se1.value) {
      case "+":
        ipt3.value = ipt1.value + ipt2.value;
        break;
      case "-":
        ipt3.value = ipt1.value - ipt2.value;
        break;
      case "*":
        ipt3.value = ipt1.value * ipt2.value;
        break;
      case "/":
        ipt3.value = ipt1.value / ipt2.value;
        break;

      default:
        alert("出错咯");
        break;
    }
  };
</script>
